<!--员工档案-->
<template>
	<el-card>
		<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
			<el-tab-pane label="教育经历" name="education">
				<Education :positionList="positionList" :ziWuList="ziWuList" :jobLevelList="jobLevelList" :workplaceList="workplaceList" />
			</el-tab-pane>
			<el-tab-pane label="工作经历" name="work_experience">
				<Experience :positionList="positionList" :ziWuList="ziWuList" :jobLevelList="jobLevelList" :workplaceList="workplaceList" />
			</el-tab-pane>
			<el-tab-pane label="家庭成员" name="family">
				<Family :positionList="positionList" :ziWuList="ziWuList" :jobLevelList="jobLevelList" :workplaceList="workplaceList" />
			</el-tab-pane>
			<el-tab-pane label="员工证书" name="certificate">
				<Certificate :positionList="positionList" :ziWuList="ziWuList" :jobLevelList="jobLevelList" :workplaceList="workplaceList" />
			</el-tab-pane>
		</el-tabs>
	</el-card>
</template>

<script setup lang="ts" name="StaffRecordIndex">
import { useCrud } from '@/hooks'
import { defineAsyncComponent, defineComponent, reactive, ref } from 'vue'
import { IHooksOptions } from '@/hooks/interface'
import { TabsPaneContext } from 'element-plus'

import Education from './plane/education-index.vue'

import { findAllApi } from '@/api/nb/organization/workplace'
import { findListByDictId } from '@/api/nb/business/dictionaries_subset'
import { findAll as findJobLevel } from '@/api/nb/organization/position/level'
import { findAll } from '@/api/nb/organization/position'

const Experience = defineAsyncComponent(() => import('./plane/experience-index.vue'))
const Family = defineAsyncComponent(() => import('./plane/family-index.vue'))
const Certificate = defineAsyncComponent(() => import('./plane/certificate-index.vue'))

defineComponent({
	components: { Certificate, Family, Experience }
})

const state: IHooksOptions = reactive({
	dataListUrl: '/nb/staff/record/page',
	deleteUrl: '/nb/staff/record/delete',
	queryForm: {}
})

// 获取职位
const positionList = ref()
const getPosition = () => {
	return findAll().then(res => {
		positionList.value = res.data
	})
}
getPosition()

// 获取职务
const ziWuList = ref()
const getDictList = (code: String, list: Ref) => {
	findListByDictId({ params: { code: code } }).then(res => {
		list.value = res.data
	})
}
getDictList('ZhiWu', ziWuList)

// 获取 所属职级
const jobLevelList = ref()
const getJobLevelList = () => {
	return findJobLevel().then(res => {
		jobLevelList.value = res.data
	})
}
getJobLevelList()

// 获取 工作地点
const workplaceList = ref()
const getWorkplace = () => {
	return findAllApi().then(res => {
		workplaceList.value = res.data
	})
}
getWorkplace()

const activeName = ref('education')

const handleClick = (tab: TabsPaneContext, event: Event) => {
	console.log(tab, event)
}

const { getDataList, selectionChangeHandle, sizeChangeHandle, currentChangeHandle, deleteBatchHandle } = useCrud(state)
</script>
